import { defineStore } from 'pinia'
import { reactive, ref } from 'vue'

export const useProductStore = defineStore('product', () => {
  const querySpuList = ref([])
  const formData = ref({
    id: null,
    categoryId: null,
    title: '',
    subTitle: '',
    description: '',
    credits: 0,
    isPreview: false,
    isRecommend: false,
    isNew: false,
    skuInfoList: [],
    spuContent: ''
  })

  function updateSkuInfoImgUrl(index, url) {
    formData.value.skuInfoList[index].imgUrl = url

  }

  function updateattrListRes(attr) {
    formData.value.attrListRes = attr
  }

  function clearFormData() {
    formData.value = {
      id: null,
      categoryId: null,
      title: '',
      subTitle: '',
      description: '',
      credits: 0,
      isPreview: false,
      isRecommend: false,
      isNew: false,
      skuInfoList: [],
      spuContent: ''
    }
  }

  return {
    formData,
    updateSkuInfoImgUrl,
    querySpuList,
    updateattrListRes,
    clearFormData
  }
})